<template>
  <div id="report-commit">
    <sui-segment stacked="tall">
      <sui-form>
        <sui-form-field>
          <h4 style="margin-bottom:15px;font-weight:300">标题</h4>
          <sui-input placeholder="Title..." focus/>
        </sui-form-field>
        <sui-divider />
        <sui-grid :columns="2" divided>
          <sui-grid-row>
            <sui-grid-column :width="11">
              <ClientOnly>
                <mavon-editor style="z-index: auto;" :scrollStyle="true" :subfield="true" defaultOpen="preview" v-model="value" @save="save" />
              </ClientOnly>
            </sui-grid-column>
            <sui-grid-column :width="5">
              <sui-segment>1</sui-segment>
              <sui-segment>2</sui-segment>
              <sui-segment>3</sui-segment>
            </sui-grid-column>
          </sui-grid-row>
        </sui-grid>
        <sui-divider />
      </sui-form>
      <sui-button>Submit</sui-button>
    </sui-segment>
  </div>
</template>

<script>
import axios from "axios";
export default {
  components: {},
  data() {
    return {
      value: ""
    };
  },
  methods: {
    save() {
      this.$refs.CommitModal.show();
      console.log("保存");
    }
  }
};
</script>
<style lang="scss">
.content:not(.custom) {
  max-width: none;
}
</style>